<template>
	<view>
		<view class="top">
			<image :src="details.img"></image>
			<view>{{details.name}}</view>
			<view>网商价：<span style='color: red;'>￥{{details.price}}</span></view>
		</view>
		<view class="bottom">
			<view class="list" v-if="fenlei=='cpu'">
				<view class="box"><view>品牌：</view><view>{{details.brand}}</view></view>
				<view class="box"><view>CPU系列：</view><view>{{details.xilie}}</view></view>
				<view class="box"><view>主频：</view><view>{{details.zhupin}}GHz</view></view>
				<view class="box"><view>动态加速频率：</view><view>{{details.chaopin}}</view></view>
				<view class="box"><view>核数：</view><view>{{details.heshu}}核心</view></view>
				<view class="box"><view>线程数：</view><view>{{details.thread}}</view></view>
				<view class="box"><view>封装大小：</view><view>{{details.size}}</view></view>
				<view class="box"><view>插槽类型：</view><view>{{details.type}}</view></view>
			</view>
			<view class="list" v-if="fenlei=='xianka'">
				<view class="box"><view>品牌：</view><view>{{details.brand}}</view></view>
				<view class="box"><view>显卡芯片：</view><view>{{details.xinpian}}</view></view>
				<view class="box"><view>显存容量：</view><view>{{details.xiancun}}GB</view></view>
				<view class="box"><view>显存频率：</view><view>{{details.xian_pin}}</view></view>
				<view class="box"><view>电源接口：</view><view>{{details.jiekou}}</view></view>
				<view class="box"><view>供电模式：</view><view>{{details.moshi}}</view></view>
				<view class="box"><view>核心频率：</view><view>{{details.he_pin}}GHz</view></view>
				<view class="box"><view>显存位宽：</view><view>{{details.weikuan}}</view></view>
				<view class="box"><view>类型：</view><view>{{details.type}}</view></view>
			</view>
			<view class="list" v-if="fenlei=='zhuban'">
				<view class="box"><view>品牌：</view><view>{{details.brand}}</view></view>
				<view class="box"><view>主芯片组：</view><view>{{details.xinpian}}</view></view>
				<view class="box"><view>音频芯片：</view><view>{{details.yinpian}}</view></view>
				<view class="box"><view>内存类型：</view><view>{{details.neicuntype}}</view></view>
				<view class="box"><view>最大内存容量：</view><view>{{details.max_neicun}}</view></view>
				<view class="box"><view>供电模式：</view><view>{{details.dianyuan}}</view></view>
				<view class="box"><view>主板类型：</view><view>{{details.type}}</view></view>
				<view class="box"><view>外形尺寸：</view><view>{{details.size}}</view></view>
			</view>
			<view class="list" v-if="fenlei=='neicun'">
				<view class="box"><view>品牌：</view><view>{{details.brand}}</view></view>
				<view class="box"><view>内存类型：</view><view>{{details.type}}</view></view>
				<view class="box"><view>内存主频：</view><view>{{details.zhupin}}</view></view>
				<view class="box"><view>内存容量：</view><view>{{details.size}}GB</view></view>
				<view class="box"><view>适用类型：</view><view>{{details.shiyong}}</view></view>
			</view>
			<view class="list" v-if="fenlei=='yingpan'">
				<view class="box"><view>品牌：</view><view>{{details.brand}}</view></view>
				<view class="box"><view>读取速度：</view><view>{{details.du}}</view></view>
				<view class="box"><view>写入速度：</view><view>{{details.xie}}</view></view>
				<view class="box"><view>缓存：</view><view>{{details.huancun}}</view></view>
				<view class="box"><view>硬盘尺寸：</view><view>{{details.size}}</view></view>
				<view class="box"><view>无故障时间：</view><view>{{details.wuguzhang}}</view></view>
				<view class="box"><view>接口类型：</view><view>{{details.type}}</view></view>
				<view class="box"><view>平均寻道时间：</view><view>{{details.shijian}}</view></view>
			</view>
			<view class="list" v-if="fenlei=='sanreqi'">
				<view class="box"><view>品牌：</view><view>{{details.brand}}</view></view>
				<view class="box"><view>散热器类型：</view><view>{{details.type}}</view></view>
				<view class="box"><view>散热方式：</view><view>{{details.fangshi}}</view></view>
				<view class="box"><view>输入功率：</view><view>{{details.gonglv}}</view></view>
				<view class="box"><view>风扇尺寸：</view><view>{{details.size}}</view></view>
				<view class="box"><view>转轴类型：</view><view>{{details.zhoucheng}}</view></view>
				<view class="box"><view>噪音：</view><view>{{details.zaoyin}}</view></view>
				<view class="box"><view>转数：</view><view>{{details.zhuanshu}}</view></view>
			</view>
			<view class="list" v-if="fenlei=='dianyuan'">
				<view class="box"><view>品牌：</view><view>{{details.brand}}</view></view>
				<view class="box"><view>额定功率：</view><view>{{details.pin}}</view></view>
				<view class="box"><view>PFC类型：</view><view>{{details.PFC}}</view></view>
				<view class="box"><view>转换效率：</view><view>{{details.xiaolv}}</view></view>
				<view class="box"><view>硬件接口：</view><view>{{details.yingjie}}</view></view>
				<view class="box"><view>主板接口：</view><view>{{details.zhujie}}</view></view>
				<view class="box"><view>出线类型：</view><view>{{details.chuxian}}</view></view>
				<view class="box"><view>电源类型：</view><view>{{details.type}}</view></view>
			</view>
			<view class="list" v-if="fenlei=='jixiang'">
				<view class="box"><view>品牌：</view><view>{{details.brand}}</view></view>
				<view class="box"><view>适用主板：</view><view>{{details.zhuban}}</view></view>
				<view class="box"><view>前置接口：</view><view>{{details.qianjie}}</view></view>
				<view class="box"><view>板材厚度：</view><view>{{details.houdu}}</view></view>
				<view class="box"><view>机箱结构：</view><view>{{details.jiegou}}</view></view>
				<view class="box"><view>电源设计：</view><view>{{details.dianyuan}}</view></view>
				<view class="box"><view>扩展插槽：</view><view>{{details.chacao}}</view></view>
				<view class="box"><view>机箱材质：</view><view>{{details.caizhi}}</view></view>
				<view class="box"><view>机箱类型：</view><view>{{details.type}}</view></view>
			</view>
		</view>
	</view>
</template>

<script>
	const db=wx.cloud.database()
	const _=db.command
	export default {
		data() {
			return {
				fenlei:'',
				id:'',
				details:null
			}
		},
		onLoad(option) {
			this.fenlei=option.fenlei
			this.id=option.id
			this.getdetail()
		},
		methods: {
			getdetail(){
				console.log(this.fenlei)
				db.collection(this.fenlei).where({
					_id:_.eq(this.id)
				}).get().then(res=>{
					console.log(res.data[0])
					this.details=res.data[0]
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
.top{
	display: flex;
	flex-direction: column;
	padding: 10px;
	background-color: white;
	align-items: center;
	image{
		width: 40vw;
		height: 20vh;
	}
	view{
		margin-top: 2vh;
	}
}
.bottom{
	margin-top: 3vh;
	padding: 10px 10px 0px 10px;
	background-color: white;
	.list{
		.box{
			padding: 15px 10px;
			border-bottom: 1px solid #F1F1F1;
			display: flex;
			flex-direction: row;
			align-items: center;
			view:first-child{
				width: 35vw;
				
			}
			view:last-child{
				margin-left: 5vw;
				width: 60vw;
				color: #1296db;
			}
		}	
	}
	
}
</style>
